<template>
  <view class="feedback main-box">

      <view class="feedback-title"><text class="require">*</text>反馈内容</view>
      <view class="feedback-content com-textarea">
        <uv-input maxlength="300" placeholder="请详细说明反馈内容，以便我们解决问题，您的反馈是我们最大的动力。"
                  v-model="formData.feedback"
                  type="textarea"
                  height="300"
                  auto-height="autoHeight"
        >
          <template #suffix>
            <text class="user-input-text com-textarea-prompt">{{ formData.feedback.length || '0' }}/300</text>
          </template>
        </uv-input>
      </view>


      <button class="icon-btn-b icon-btn-s1" @click="handleGetComplaint" :loading="subBtnLoading">提交</button>


  </view>
</template>
<script setup>
import {ref} from 'vue';
import { jumpBack } from '@/utils/index';
import loginApi from "@/apis/login";
const subBtnLoading = ref(false);
const formData = {
  feedback:''
}
const handleGetComplaint = ()=>{

  if(formData.feedback){
    subBtnLoading.value = true;
    loginApi.getComplaint({content:formData.feedback}).then(res=>{
      if (res.code === "SUCCESS") {
        formData.feedback = '';
        uni.showToast({
          icon:'success',
          title: '提交成功!',
          duration: 2000
        });
        jumpBack();
      }
    }).finally(()=>{
      subBtnLoading.value = false;
    })
  }else{
    uni.showToast({
      icon:'error',
      title: '请填写反馈内容!',
      duration: 2000
    });
  }


}

</script>

<style lang="scss" scoped>

.feedback{
  &-title{
    font-weight: 500;
    @include main-line3;
    .require{color:$main-b;}
  }
  &-content{
    padding:0 20rpx;
    background-color: $main-text-e;
    border-radius: 15rpx;
    @include main-line3;
  }
  &-submit{
    @include main-line0;
    width: 80%;
    margin-right: auto;
    margin-left: auto;
  }
}

</style>
